<template>
	<view>
		<view class="TUI-message-input-container">
			<view class="TUI-commom-function">
				<view v-for="(item, index) in commonFunction" :key="index" class="TUI-commom-function-item"
					:data-function="item" @tap="handleCommonFunctions">
					{{ item.name }}
				</view>
			</view>
			<view class="TUI-message-input">
				<image class="TUI-icon" @tap="switchAudio"
					:src="isAudio ? '/static/static/assets/keyboard.svg' : '/static/static/assets/audio.svg'"></image>
				<view v-if="!isAudio" class="TUI-message-input-main">
					<input class="TUI-message-input-area" :adjust-position="true" cursor-spacing="20"
						v-model="inputText" @input="onInputValueChange" maxlength="140" type="text"
						placeholder-class="input-placeholder" placeholder="说点什么呢~" @focus="inputBindFocus"
						@blur="inputBindBlur" />
				</view>
				<view v-else class="TUI-message-input-main" @longpress="handleLongPress" @touchmove="handleTouchMove"
					@touchend="handleTouchEnd"
					style="display: flex; justify-content: center; font-size: 32rpx; font-family: PingFangSC-Regular;">
					<text>{{ text }}</text>
				</view>
				<view class="TUI-message-input-functions" hover-class="none">
					<image class="TUI-icon" @tap="handleEmoji" src="/static/static/assets/face-emoji.svg"></image>
					<view v-if="!sendMessageBtn" @tap="handleExtensions">
						<image class="TUI-icon" src="/static/static/assets/more.svg"></image>
					</view>
					<view v-else class="TUI-sendMessage-btn" @tap="sendTextMessage">发送</view>
				</view>
			</view>
			<view v-if="displayFlag === 'emoji'" class="TUI-Emoji-area"><TUI-Emoji
					@enterEmoji="appendMessage"></TUI-Emoji></view>
			<view v-if="displayFlag === 'extension'" class="TUI-Extensions">
				<!-- TODO: 这里功能还没实现 -->
				<!--        <camera device-position="back" flash="off" binderror="error" style="width: 100%; height: 300px;"></camera>-->
				<view class="TUI-Extension-slot" @tap="handleSendPicture">
					<image class="TUI-Extension-icon" src="/static/static/assets/take-photo.svg"></image>
					<view class="TUI-Extension-slot-name">拍摄照片</view>
				</view>
				<view class="TUI-Extension-slot" @tap="handleSendImage">
					<image class="TUI-Extension-icon" src="/static/static/assets/send-img.svg"></image>
					<view class="TUI-Extension-slot-name">发送图片</view>
				</view>
				<view class="TUI-Extension-slot" @tap="handleShootVideo">
					<image class="TUI-Extension-icon" src="/static/static/assets/take-video.svg"></image>
					<view class="TUI-Extension-slot-name">拍摄视频</view>
				</view>
				<view class="TUI-Extension-slot" @tap="handleSendVideo">
					<image class="TUI-Extension-icon" src="/static/static/assets/send-video.svg"></image>
					<view class="TUI-Extension-slot-name">发送视频</view>
				</view>
				<view class="TUI-Extension-slot" @tap="jubao">
					<image class="TUI-Extension-icon" src="/static/static/assets/jubao.png"></image>
					<view class="TUI-Extension-slot-name">举报</view>
				</view>
				<view class="TUI-Extension-slot" @tap="lahei">
					<image class="TUI-Extension-icon" src="/static/WechatIMG95.png"></image>
					<view class="TUI-Extension-slot-name">拉黑</view>
				</view>
				<!-- <view class="TUI-Extension-slot" @tap="handleCalling(2)">
					<image class="TUI-Extension-icon" src="/static/static/assets/video-calling.svg"></image>
					<view class="TUI-Extension-slot-name">视频通话</view>
				</view>
				<view class="TUI-Extension-slot" @tap="handleServiceEvaluation">
					<image class="TUI-Extension-icon" src="/static/static/assets/service-assess.svg"></image>
					<view class="TUI-Extension-slot-name">服务评价</view>
				</view> -->
				<view class="TUI-Extension-slot" @tap="hongbao">
					<image class="TUI-Extension-icon" src="/static/IM/hongbao.png"></image>
					<view class="TUI-Extension-slot-name">发红包</view>
				</view>
			</view>
			<TUI-Common-Words class="tui-cards" :display="displayCommonWords" @sendMessage="$handleSendTextMessage"
				@close="$handleCloseCards"></TUI-Common-Words>
			<TUI-Order-List class="tui-cards" :display="displayOrderList" @sendCustomMessage="$handleSendCustomMessage"
				@close="$handleCloseCards"></TUI-Order-List>
			<TUI-Service-Evaluation class="tui-cards" :display="displayServiceEvaluation"
				@sendCustomMessage="$handleSendCustomMessage" @close="$handleCloseCards"></TUI-Service-Evaluation>
		</view>
		<view class="record-modal" v-if="popupToggle" @longpress="handleLongPress" @touchmove="handleTouchMove"
			@touchend="handleTouchEnd">
			<view class="wrapper">
				<view class="modal-loading"></view>
			</view>
			<view class="modal-title">{{ title }}</view>
		</view>
		<u-popup v-model="show" mode="bottom" height="600" border-radius="20">
			<view class="pop">
				<image src="/static/IM/hongsaf.png" mode=""></image>
				<view class="money" v-if="conversation.type=='GROUP'">
					<text>个数：</text>
					<input type="number" placeholder="请输入个数" v-model="numbers">
				</view>
				<view class="number">
					<text>金额：</text>
					<input type="number" placeholder="请输入金额" v-model="money">
				</view>
				<view class="btn" @click="sendPriceRe">发送</view>
			</view>
		</u-popup>
		<u-modal v-model="sbshow" title="获取访问相机权限" @confirm="confirmdad" :content="content"
			show-cancel-button="false"></u-modal>
		<u-modal v-model="sbshow1" title="获取相册权限" @confirm="confirmdad1" :content="content1"
			show-cancel-button="false"></u-modal>
		<u-modal v-model="sbshow2" title="获取访问相机权限" @confirm="confirmdad2" :content="content2"
			show-cancel-button="false"></u-modal>
		<u-modal v-model="sbshow3" title="获取相册权限" @confirm="confirmdad3" :content="content3"
			show-cancel-button="false"></u-modal>
		<u-modal v-model="sbshow4" title="获取录音权限" @confirm="confirmdad4" :content="content4"
			show-cancel-button="false"></u-modal>
		<u-popup v-model="presonShow" mode="bottom" height="500px" :border-radius="30" :closeable="true">
			<view class="qmember">
				<view class="qmember-li" v-for="(itemw,indexw) in memberList" :key="indexw" @click="pitchSe(itemw)">
					<image :src="itemw.avatar" mode=""></image>
					<text>{{itemw.nick}}</text>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		sendPrice
	} from '@/network/api.js'
	import TUIEmoji from '../message-elements/emoji/index';
	import TUICommonWords from '../message-private/common-words/index';
	import TUIOrderList from '../message-private/order-list/index';
	import TUIServiceEvaluation from '../message-private/service-evaluation/index';

	export default {
		data() {
			return {
				// todo  conversation
				// conversation: {},
				sbshow: false,
				sbshow1: false,
				sbshow2: false,
				sbshow3: false,
				sbshow4: false,
				content: 'App需要您的同意才能访问相机，用于拍照、扫码场景下的使用',
				content1: 'App需要您的同意才能访问相册，用于编辑用户信息',
				content2: 'App需要您的同意才能访问相机，用于拍照、扫码场景下的使用',
				content3: 'App需要您的同意才能访问相册，用于编辑用户信息',
				content4: 'App需要您的同意才能访问录音功能，用于录制及发送语音',
				money: '',
				show: false,
				numbers: 1,
				firstSendMessage: true,
				inputText: '',
				extensionArea: false,
				sendMessageBtn: false,
				displayFlag: '',
				isAudio: false,
				bottomVal: 0,
				startPoint: 0,
				popupToggle: false,
				isRecording: false,
				canSend: true,
				text: '按住说话',
				title: ' ',
				notShow: false,
				isShow: true,
				recordTime: 0,
				recordTimer: null,
				commonFunction: [{
					name: '常用语',
					key: '0'
				}],
				displayServiceEvaluation: false,
				displayCommonWords: false,
				displayOrderList: false,
				give: {},
				presonShow: false,
				memberList: [],
				pitch: '',
				actionAtUser: [],
				textleng: '',
				infoData: {}
			};
		},

		components: {
			TUIEmoji,
			TUICommonWords,
			TUIOrderList,
			TUIServiceEvaluation
		},
		props: {
			conversation: {
				type: Object,
				default: () => {}
			}
		},
		watch: {
			conversation: {
				handler: function(newVal) {
					// todo 值会被改变
					// this.setData({
					//   conversation: newVal
					// });
				},
				immediate: true,
				deep: true
			},
			inputText(newVal, oldVal) {
				//判断用户是否输入，如果是输入并且最后一个字符是@则为@用户
				if (newVal?.length > oldVal?.length && this.conversation.type === 'GROUP') {
					if (newVal[newVal?.length - 1] === '@') {
						this.infoew()
						// 关闭键盘
						uni.hideKeyboard();
						this.presonShow = true
						this.setData({
							sendMessageBtn: true
						});
						console.log('输入@')
					}
				} else {
					console.log('删除')
					this.delAtUser(newVal, oldVal)
				}
			}
		},

		beforeMount() {
			// 加载声音录制管理器
			this.recorderManager = uni.getRecorderManager();
			this.recorderManager.onStop(res => {
				clearInterval(this.recordTimer);
				// 兼容 uniapp 打包app，duration 和 fileSize 需要用户自己补充
				// 文件大小 ＝ (音频码率) x 时间长度(单位:秒) / 8
				let msg = {
					duration: res.duration ? res.duration : this.recordTime * 1000,
					tempFilePath: res.tempFilePath,
					fileSize: res.fileSize ? res.fileSize : ((48 * this.recordTime) / 8) * 1024
				};
				uni.hideLoading();
				// 兼容 uniapp 语音消息没有duration
				if (this.canSend) {
					if (msg.duration < 1000) {
						uni.showToast({
							title: '录音时间太短',
							icon: 'none'
						});
					} else {
						// res.tempFilePath 存储录音文件的临时路径
						const message = uni.$TUIKit.createAudioMessage({
							to: this.getToAccount(),
							conversationType: this.conversation.type,
							payload: {
								file: msg
							}
						});
						this.$sendTIMMessage(message);
					}
				}

				this.setData({
					startPoint: 0,
					popupToggle: false,
					isRecording: false,
					canSend: true,
					title: ' ',
					text: '按住说话'
				});
			});
		},

		methods: {
			pitchSe(item) {
				// this.inputText = this.inputText + item.userID
				if (item?.nick && item?.userID.length > 0) {
					this.inputText += item?.nick + ' '
					this.actionAtUser.push({
						text: item?.nick,
						id: item?.userID
					})
				}
				this.presonShow = false
			},
			inputWath(e) {
				console.log(e, '输入')
			},
			lahei() {
				uni.showToast({
					title: '拉黑成功',
					icon: 'error'
				});
			},
			jubao() {
				uni.showToast({
					title: '举报成功',
					icon: 'error'
				});
			},
			switchAudio() {
				if (this.isAudio == false) {
					this.sbshow4 = true
				}
				this.setData({
					isAudio: !this.isAudio,
					text: '按住说话'
				});
			},

			handleLongPress(e) {
				this.recorderManager.start({
					duration: 60000,
					// 录音的时长，单位 ms，最大值 600000（10 分钟）
					sampleRate: 44100,
					// 采样率
					numberOfChannels: 1,
					// 录音通道数
					encodeBitRate: 192000,
					// 编码码率
					format: 'aac' // 音频格式，选择此格式创建的音频消息，可以在即时通信 IM 全平台（Android、iOS、微信小程序和Web）互通
				});
				this.setData({
					startPoint: e.touches[0],
					title: '正在录音',
					// isRecording : true,
					// canSend: true,
					notShow: true,
					isShow: false,
					isRecording: true,
					popupToggle: true,
					recordTime: 0
				});
				this.recordTimer = setInterval(() => {
					this.recordTime++;
				}, 1000);
			},

			// 录音时的手势上划移动距离对应文案变化
			handleTouchMove(e) {
				if (this.isRecording) {
					if (this.startPoint.clientY - e.touches[e.touches.length - 1].clientY > 100) {
						this.setData({
							text: '抬起停止',
							title: '松开手指，取消发送',
							canSend: false
						});
					} else if (this.startPoint.clientY - e.touches[e.touches.length - 1].clientY > 20) {
						this.setData({
							text: '抬起停止',
							title: '上划可取消',
							canSend: true
						});
					} else {
						this.setData({
							text: '抬起停止',
							title: '正在录音',
							canSend: true
						});
					}
				}
			},

			// 手指离开页面滑动
			handleTouchEnd() {
				this.setData({
					isRecording: false,
					popupToggle: false
				});
				uni.hideLoading();
				this.recorderManager.stop();
			},
			handleEmoji() {
				let targetFlag = 'emoji';

				if (this.displayFlag === 'emoji') {
					targetFlag = '';
				}

				this.setData({
					displayFlag: targetFlag
				});
			},

			handleExtensions() {
				let targetFlag = 'extension';

				if (this.displayFlag === 'extension') {
					targetFlag = '';
				}

				this.setData({
					displayFlag: targetFlag
				});
			},

			error(e) {
				console.log(e.detail);
			},
			handleSendPicture() {
				this.sbshow = true
			},
			handleSendImage() {
				this.sbshow1 = true
			},
			handleShootVideo() {
				this.sbshow2 = true
			},
			handleSendVideo() {
				this.sbshow3 = true
			},
			confirmdad() {
				this.sendImageMessage('camera');
			},
			confirmdad1() {
				this.sendImageMessage('album');
			},
			confirmdad2() {
				this.sendVideoMessage('camera');
			},
			confirmdad3() {
				this.sendVideoMessage('album');
			},
			confirmdad4() {
				this.sbshow4 = false
				uni.setStorageSync("sbshow4", true)
			},
			sendImageMessage(type) {
				uni.chooseImage({
					sourceType: [type],
					count: 1,
					success: res => {
						if (res) {
							const message = uni.$TUIKit.createImageMessage({
								to: this.getToAccount(),
								conversationType: this.conversation.type,
								payload: {
									file: res
								},
								onProgress: percent => {
									message.percent = percent;
								}
							});
							this.$sendTIMMessage(message);
						}
					}
				});
			},
			sendVideoMessage(type) {
				uni.chooseVideo({
					sourceType: [type],
					// 来源相册或者拍摄
					maxDuration: 60,
					// 设置最长时间60s
					camera: 'back',
					// 后置摄像头
					success: res => {
						if (res) {
							const message = uni.$TUIKit.createVideoMessage({
								to: this.getToAccount(),
								conversationType: this.conversation.type,
								payload: {
									file: res
								},
								onProgress: percent => {
									message.percent = percent;
								}
							});
							this.$sendTIMMessage(message);
						}
					}
				});
			},

			handleCommonFunctions(e) {
				switch (e.target.dataset.function.key) {
					case '0':
						this.setData({
							displayCommonWords: true
						});
						break;

					case '1':
						this.setData({
							displayOrderList: true
						});
						break;

					case '2':
						this.setData({
							displayServiceEvaluation: true
						});
						break;

					default:
						break;
				}
			},

			handleSendOrder() {
				this.setData({
					displayOrderList: true
				});
			},

			appendMessage(e) {
				this.setData({
					inputText: this.inputText + e.detail.message,
					sendMessageBtn: true
				});
			},

			getToAccount() {
				if (!this.conversation || !this.conversation.conversationID) {
					return '';
				}

				switch (this.conversation.type) {
					case 'C2C':
						return this.conversation.conversationID.replace('C2C', '');

					case 'GROUP':
						return this.conversation.conversationID.replace('GROUP', '');

					default:
						return this.conversation.conversationID;
				}
			},
			handleCalling(value) {
				// todo 目前支持单聊
				if (this.conversation.type === 'GROUP') {
					uni.showToast({
						title: '群聊暂不支持',
						icon: 'none'
					});
					return;
				}
				const {
					userID
				} = this.conversation.userProfile;

				// #ifdef APP-PLUS
				if (typeof(uni.$TUICalling) === 'undefined') {
					logger.error(
						'请使用真机运行并且自定义基座调试，可能影响音视频功能～ 插件地址：https://ext.dcloud.net.cn/plugin?id=7097 , 调试地址：https://nativesupport.dcloud.net.cn/NativePlugin/use/use'
					);
					uni.showToast({
						title: '请使用真机运行并且自定义基座调试，可能影响音视频功能～ ',
						icon: 'none',
						duration: 3000
					});
				} else {
					uni.$TUICalling.call({
							userID: userID,
							type: value
						},
						res => {
							console.log(JSON.stringify(res));
						}
					);
				}
				// #endif
				// #ifdef MP-WEIXIN
				uni.showToast({
					title: '微信小程序暂不支持',
					icon: 'none'
				});
				// uni.$wxTUICalling.call({userID, type: value})
				// #endif
			},
			sendTextMessage(msg, flag) {
				const to = this.getToAccount();
				const text = flag ? msg : this.inputText;
				console.log(this.actionAtUser, '判断')
				if (this.actionAtUser.length > 0) {
					// @所有人或某人
					let result;
					// 将匹配的用户名转换为目标格式
					result = this.actionAtUser.map(match => {
						if (match.id == '所有人') {
							return uni.$TUIKitTIM.TYPES.MSG_AT_ALL;
						} else {
							return match.id
						}
					});
					let message = uni.$TUIKit.createTextAtMessage({
						to,
						conversationType: uni.$TUIKitTIM.TYPES.CONV_GROUP,
						// payload: {
						// 	text: '@denny @lucy @所有人 今晚聚餐，收到的请回复1',
						// 	atUserList: ['denny', 'lucy',uni.$TUIKitTIM.TYPES.MSG_AT_ALL] // 'denny' 'lucy' 都是 userID，而非昵称
						// },
						payload: {
							text: this.inputText,
							atUserList: result // 'denny' 'lucy' 都是 userID，而非昵称
						},
					});

					this.setData({
						inputText: '',
						sendMessageBtn: false
					});
					this.$sendTIMMessage(message);
				} else {
					const message = uni.$TUIKit.createTextMessage({
						to,
						conversationType: this.conversation.type,
						payload: {
							text
						}
					});

					this.setData({
						inputText: '',
						sendMessageBtn: false
					});
					this.$sendTIMMessage(message);
				}
			},
			onInputValueChange(event) {
				if (event.detail.value) {
					this.setData({
						sendMessageBtn: true
					});
				} else {
					this.setData({
						sendMessageBtn: false
					});
				}
			},
			// 删除@
			delAtUser(newVal, oldVal) {
				//获取光标位置
				let cursorPosition = 0
				for (let i = 0; i < oldVal?.length; i++) {
					if (newVal[i] !== oldVal[i]) {
						cursorPosition = i
						break
					}
				}
				//光标前面的问题
				const cursorFirstText = oldVal.slice(0, cursorPosition)
				//获取@符号位置
				const atIndex = cursorFirstText.lastIndexOf('@')
				//获取@符号到光标的文字
				const atToEndStr = cursorFirstText.slice(atIndex, cursorPosition)
				//正在@的用户
				const actionAtUser = this.actionAtUser
				for (let i = 0; i < actionAtUser.length; i++) {
					const text = actionAtUser[i]?.text
					//匹配@+用户与@符号后面的文字相等则处理
					if ('@' + text === atToEndStr) {
						//获取@前面的位置，然后没有则空
						const firstText = atIndex - 1 <= 0 ? '' : newVal.slice(0, atIndex)
						//从@符号到光标的文字后面截取
						const lastText = newVal.slice(atIndex + atToEndStr?.length)
						//重新设置input框值
						this.inputText = firstText + lastText
						this.actionAtUser.splice(i, 1)
						//设置光标位置
						setTimeout(() => {
							this.inputCursor = atIndex
						}, 200)
						return
					}
				}
			},
			$handleSendTextMessage(event) {
				this.sendTextMessage(event.detail.message, true);
				this.setData({
					displayCommonWords: false
				});
			},

			$handleSendCustomMessage(e) {
				const message = uni.$TUIKit.createCustomMessage({
					to: this.getToAccount(),
					conversationType: this.conversation.type,
					payload: e.detail.payload
				});
				this.$sendTIMMessage(message);
				this.setData({
					displayOrderList: false
				});
			},

			$handleCloseCards(e) {
				switch (e.detail.key) {
					case '0':
						this.setData({
							displayCommonWords: false
						});
						break;

					case '1':
						this.setData({
							displayOrderList: false
						});
						break;

					case '2':
						this.setData({
							displayServiceEvaluation: false
						});
						break;

					default:
						break;
				}
			},

			$sendTIMMessage(message) {
				const SDKAppID = getApp().globalData.SDKAppID;
				this.$emit('sendMessage', {
					detail: {
						message
					}
				});
				uni.$TUIKit.sendMessage(message).then((res) => {
					if (this.firstSendMessage) {
						uni.$aegis.reportEvent({
							name: 'sendMessage',
							ext1: 'sendMessage-success',
							ext2: 'uniTuikitExternal',
							ext3: `${SDKAppID}`,
						})
					}
					this.firstSendMessage = false
				}).catch((error) => {
					uni.$aegis.reportEvent({
						name: 'sendMessage',
						ext1: `sendMessage-failed#error: ${error}`,
						ext2: 'uniTuikitExternal',
						ext3: `${SDKAppID}`,
					})
				})
				this.setData({
					displayFlag: ''
				});
			},

			handleClose() {
				this.setData({
					displayFlag: ''
				});
			},

			handleServiceEvaluation() {
				this.setData({
					displayServiceEvaluation: true
				});
			},
			// 跳转到红包页
			hongbao() {
				this.show = !this.show
			},
			// 发送红包，请求接口
			sendPriceRe() {
				if (this.numbers == '' || this.numbers % 1 != 0) {
					uni.showToast({
						title: "红包个数请输入整数",
						icon: "none",
						duration: 2000,
					});
				} else if (this.money=='' || this.money % 1 != 0) {
					uni.showToast({
						title: "红包金额请输入整数",
						icon: "none",
						duration: 2000,
					});
				} else {
					// C2C=='个人红包'
					if (this.conversation.type == 'C2C') {
						this.fashong()
					} else {
						if (this.numbers > this.conversation.groupProfile.memberCount) {
							uni.showToast({
								title: "红包个数超过群成员",
								icon: "none",
								duration: 2000,
							});
						} else {
							this.fashong()
						}
					}
				}
			},
			// 发送红包
			fashong() {
				let data = {
					allnum: this.numbers == 1 ? 1 : this.numbers,
					everyprice: this.money
				}
				console.log(data, '发送红包参数')
				sendPrice(data).then(res => {
					if (res.code == 1) {
						this.give = res.data
						console.log(res, '发送红包信息')
						if (this.conversation.type == 'C2C') {
							this.gerenhb()
						} else {
							this.qunkb()
						}
						this.numbers = 1
						this.money = ''
						uni.showToast({
							title: '发送成功',
							duration: 2000,
							icon: 'none'
						});
					}
				})
			},
			// 群红包
			qunkb() {
				if (this.numbers == '') {
					uni.showToast({
						title: "请输入数量",
						icon: "none",
						duration: 2000,
					});
				} else if (this.money == '') {
					uni.showToast({
						title: "请输入金额",
						icon: "none",
						duration: 2000,
					});
				} else {
					// console.log(this.conversation.type,'判断类型')
					// 2. 创建消息实例，接口返回的实例可以上屏
					var params = {
						data: 'hongb', //自定义消息列表查询唯一标识
						number: this.numbers == 1 ? 1 : this.numbers, //红包个数
						extension: this.money, //红包金额
						infoArr: [], //领取红包用户
						give: this.give
					}
					let message = uni.$TUIKit.createCustomMessage({
						to: this.getToAccount(),
						conversationType: this.conversation.type,
						isSupportExtension: true,
						payload: {
							data: JSON.stringify(params)
						}
					});
					// 3. 发送消息
					this.$sendTIMMessage(message);
					this.show = false
				}
			},
			// 个人红包
			gerenhb() {
				if (this.money == '') {
					uni.showToast({
						title: "请输入金额",
						icon: "none",
						duration: 2000,
					});
				} else {
					// console.log(this.conversation.type,'判断类型')
					// 2. 创建消息实例，接口返回的实例可以上屏
					var params = {
						data: 'hongb', //自定义消息列表查询唯一标识
						number: this.numbers == 1 ? 1 : this.numbers, //红包个数
						extension: this.money, //红包金额
						infoArr: [], //领取红包用户
						give: this.give
					}
					let message = uni.$TUIKit.createCustomMessage({
						to: this.getToAccount(),
						conversationType: this.conversation.type,
						isSupportExtension: true,
						payload: {
							data: JSON.stringify(params)
						}
					});
					// 3. 发送消息
					this.$sendTIMMessage(message);
					this.show = false
				}
			},
			// 获取个人信息
			infoew() {
				uni.$TUIKit.getMyProfile().then(imResponse => {
					this.infoData = imResponse.data
					this.showMoreHandler()
				}).catch((error) => {
					this.$u.toast(error.message);
				});
			},
			// 获取群成员
			showMoreHandler() {
				uni.$TUIKit
					.getGroupMemberList({
						groupID: this.conversation.groupProfile.groupID,
						count: 50,
						offset: 0
					}) // 从0开始拉取30个群成员
					.then(imResponse => {
						let arrdw = imResponse.data.memberList
						const filteredArray = arrdw.filter(obj => obj.nick == this.infoData.nick);
						if (filteredArray[0].role == 'Admin' || filteredArray[0].role == 'Owner') {
							arrdw.unshift({
								avatar: 'https://www.meiyiqingyang.cn/uploads/apply/20231117/G768I50qDsZX9pLK1700208440.png',
								nick: "所有人",
								userID: '所有人'
							})
							this.memberList = arrdw
						} else {
							this.memberList = arrdw
						}
						console.log(this.memberList, '群成员')
					}).catch((error) => {
						// this.$u.toast(error.message);
					})
			},
			inputBindFocus() {
				console.log('占位：函数 inputBindFocus 未声明');
			},

			inputBindBlur() {
				console.log('占位：函数 inputBindBlur 未声明');
			}
		}
	};
</script>
<style lang="scss">
	@import './index.css';

	.qmember {
		margin-top: 90rpx;
		border: 1rpx solid #e5e5e5;

		.qmember-li:active {
			background-color: #f5f5f5;
		}

		.qmember-li {
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 100rpx;
			padding: 0 30rpx;
			border-bottom: 1rpx solid #e5e5e5;

			>image {
				width: 80rpx;
				height: 80rpx;
				border-radius: 20rpx;
				// border: 1rpx solid red;
			}

			>text {}
		}
	}

	.pop {
		padding: 30rpx;

		>image {
			width: 50rpx;
			height: 50rpx;
		}

		.number,
		.money {
			display: flex;
			align-items: center;
			padding: 10rpx 20rpx;
			margin: 40rpx 40rpx;
			font-size: 25rpx;
			color: #d9c06b;
			border-radius: 30rpx;
			border: 1rpx solid #a6874b;

			input {
				width: 400rpx;
			}
		}

		.btn {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 200rpx;
			height: 60rpx;
			padding: 10rpx 20rpx;
			margin: 120rpx 40rpx;
			margin-left: auto;
			letter-spacing: 7px;
			font-size: 35rpx;
			color: #d9c06b;
			border-radius: 30rpx;
			border: 1rpx solid #a6874b;
		}

		.btn:active {
			color: #fff;
			background-color: #d9c06b;
		}
	}
</style>